<template>
  <div id="zbbsmzIndex">
    <el-dialog title="查看" :visible.sync="detailVisible" width="98%" top="20px" append-to-body :close-on-click-modal="false" :close-on-press-escape="false">
      <unitDetail :mydata="mydata" :jgsyCode="jgsyCode" :sourceTable="sourceTable" :hidemoredetail="true"></unitDetail>
    </el-dialog>
    <el-breadcrumb separator=">">
      <el-breadcrumb-item :to="{ path: '/' }">系统首页</el-breadcrumb-item>
      <!-- <el-breadcrumb-item>人才建设</el-breadcrumb-item> -->
      <el-breadcrumb-item>编制统计</el-breadcrumb-item>
    </el-breadcrumb>
    <section class="wboxs">
    <!--工具条-->
      <h1>编制统计（导入文件名：{{fileName}}）</h1>
      <el-form :inline="true" :model="filters">
        <div style="padding:12px 12px 0;">
          <el-form-item label=" " label-width="20px">
            <el-checkbox v-model="filters.includeCgs" @change="getList">包含地调局</el-checkbox>
          </el-form-item>
          <el-form-item v-if="importVersion>supportVersion"><span style="font-size:20px;font-weight: bolder;color:red;">系统当前仅支持到{{supportVersion}}版本，当前数据版本为{{importVersion}}，高于支持版本，数据统计可能不准确，请与管理员联系</span></el-form-item>
          <el-form-item v-else>当前数据版本为{{importVersion}}</el-form-item>
          <el-form-item label=" " label-width="20px">
            <el-checkbox v-model="canSelect">选择</el-checkbox>
            <el-button size="mini" type="success" @click="exportData" v-if="jgsyCodes.length>0">导出所选{{jgsyCodes.length}}家单位台帐</el-button>
            <el-button size="mini" type="danger" @click="jgsyCodes=[]" v-if="jgsyCodes.length>0">取消选择</el-button>
            <el-button size="mini" type="primary" @click="exportAllBdData">导出全部单位台帐</el-button>
          </el-form-item>
          <el-form-item style="float:right;">
            <el-button type="primary" @click="analyseData" icon="el-icon-data-line">统计分析</el-button>
            <el-button type="success" @click="importData" icon="el-icon-circle-plus-outline">导入数据</el-button>
            <!-- <el-button type="primary" @click="exportAllData" icon="el-icon-download">导出数据</el-button>
            <el-button type="success" @click="exportTopData" icon="el-icon-download">导出部记录</el-button> -->
            <el-dropdown split-button type="primary" @click="exportAllData" style="margin-left:10px">
              导出数据
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item @click.native="exportUnitData">导出中间表</el-dropdown-item>
                <el-dropdown-item @click.native="exportTopData">导出部记录</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </el-form-item>
        </div>
      </el-form>
    </section>
    <section class="wboxd" :style="'margin-top:10px;height:'+tableHeight+'px;overflow-y:scroll;overflow-x: auto;'">
      <!--列表-->
      <table class="mainBzTable" cellspacing="0" cellpadding="0" border="0" :style="'position:fixed;width:'+tableWidth+'px'">
        <colgroup>
          <col style="width: 50px;" v-if="canSelect" />
          <col style="min-width:200px" />
          <col style="width: 70px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
        </colgroup>
        <thead>
          <tr>
            <th v-if="canSelect" rowspan="4" />
            <th rowspan="4"></th>
            <th colspan="10">单位</th>
            <th colspan="6" rowspan="2">领导职数</th>
            <th rowspan="3" colspan="3">行政编制</th>
            <th rowspan="3" colspan="3">事业编制</th>
          </tr>
          <tr>
            <th colspan="6">按单位规格统计</th>
            <th colspan="4">按单位分类统计</th>
          </tr>
          <tr>
            <th rowspan="2">事业单位合计</th>
            <th rowspan="2">副部</th>
            <th colspan="2">司局级</th>
            <th colspan="2">处级</th>
            <th colspan="4">分类</th>
            <th colspan="2">部级</th>
            <th colspan="2">司局级</th>
            <th colspan="2">处级</th>
          </tr>
          <tr>
            <th>机关</th>
            <th>事业</th>
            <th>机关</th>
            <th>事业</th>
            <th>一类</th>
            <th>二类</th>
            <th>经营</th>
            <th>未分</th>
            <th>正职</th>
            <th>副职</th>
            <th>正职</th>
            <th>副职</th>
            <th>正职</th>
            <th>副职</th>
            <th>核定</th>
            <th>在编</th>
            <th>空编</th>
            <th>核定</th>
            <th>在编</th>
            <th>空编</th>
          </tr>
        </thead>
      </table>
      <el-checkbox-group v-model="jgsyCodes">
      <table class="mainBzTable" ref="dataTable" id="dataTable" cellspacing="0" cellpadding="0" border="0" v-loading="listLoading">
        <colgroup>
          <col style="width: 50px;" v-if="canSelect" />
          <col style="min-width:200px" />
          <col style="width: 70px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 50px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
          <col style="width: 65px;" />
        </colgroup>
        <thead>
          <tr>
            <th v-if="canSelect" rowspan="4" />
            <th rowspan="4"></th>
            <th colspan="10">单位</th>
            <th colspan="6" rowspan="2">领导职数</th>
            <th rowspan="3" colspan="3">行政编制</th>
            <th rowspan="3" colspan="3">事业编制</th>
          </tr>
          <tr>
            <th colspan="6">按单位规格统计</th>
            <th colspan="4">按单位分类统计</th>
          </tr>
          <tr>
            <th rowspan="2">事业单位合计</th>
            <th rowspan="2">副部</th>
            <th colspan="2">司局级</th>
            <th colspan="2">处级</th>
            <th colspan="4">分类</th>
            <th colspan="2">部级</th>
            <th colspan="2">司局级</th>
            <th colspan="2">处级</th>
          </tr>
          <tr>
            <th>机关</th>
            <th>事业</th>
            <th>机关</th>
            <th>事业</th>
            <th>一类</th>
            <th>二类</th>
            <th>经营</th>
            <th>未分</th>
            <th>正职</th>
            <th>副职</th>
            <th>正职</th>
            <th>副职</th>
            <th>正职</th>
            <th>副职</th>
            <th>核定</th>
            <th>在编</th>
            <th>空编</th>
            <th>核定</th>
            <th>在编</th>
            <th>空编</th>
          </tr>
        </thead>
        <tbody v-for="item in list" :key="item.allId">
          <tr style=" background: #D5FFE8;">
            <td v-if="canSelect" />
            <td>
              <i :class="(expandKeys.indexOf(item.allId.toString())>-1)?'el-icon-arrow-down':'el-icon-arrow-right'" style="cursor: pointer;" v-if="item.children&&item.children.length>0" @click="changeShow(item.allId)"></i>
               {{item.name}}
            </td>
            <td align="center">{{item.countCentreSy}}</td>
            <td align="center">{{item.unitNumBu}}</td>
            <td align="center">{{item.unitNumSjjDepart}}</td>
            <td align="center">{{item.unitNumSjjSy}}</td>
            <td align="center">{{item.unitNumCjDepart}}</td>
            <td align="center">{{item.unitNumCjSy}}</td>
            <td align="center">{{item.unitNumType1}}</td>
            <td align="center">{{item.unitNumType2}}</td>
            <td align="center">{{item.unitNumTypeJingying}}</td>
            <td align="center">{{item.unitNumTypeWeifen}}</td>
            <td align="center">{{item.SBJZZBZ}}</td>
            <td align="center">{{item.SBJFZBZ}}</td>
            <td align="center">{{item.TJJZZBZ}}</td>
            <td align="center">{{item.TJJFZBZ}}</td>
            <td align="center">{{item.XCJZZBZ}}</td>
            <td align="center">{{item.XCJFZBZ}}</td>
            <td align="center">{{item.DABZST}}</td>
            <td align="center">{{item.DRBZST}}</td>
            <td align="center">{{item.DKBZST}}</td>
            <td align="center">{{item.SYBZHD}}</td>
            <td align="center">{{item.SYBZZB}}</td>
            <td align="center">{{item.SYBZKB}}</td>
          </tr>
          <template v-if="item.children&&item.children.length>0&&expandKeys.indexOf(item.allId.toString())>-1">
            <template v-for="it in item.children">
              <tr :key="it.allId" :style="setBgColor(it.allId)">
                <td v-if="canSelect" align="center"><el-checkbox v-if="it.canExport" :label="it.jgsyCode"><br></el-checkbox></td>
                <td>
                  <span style="padding-left:20px;"> <i :class="(expandKeys.indexOf(it.allId.toString())>-1)?'el-icon-arrow-down':'el-icon-arrow-right'" style="cursor: pointer;" v-if="it.children&&it.children.length>0" @click="changeShow(it.allId)"></i>
                    <b v-if="it.jgsyCode" @click="detail(it)" style="cursor:pointer;color:#0058AC">{{it.name}}</b>
                    <template v-else>{{it.name}}</template>
                    <!-- {{it.name}} -->
                  </span>
                </td>
                <td align="center">{{it.countCentreSy}}</td>
                <td align="center">{{it.unitNumBu}}</td>
                <td align="center">{{it.unitNumSjjDepart}}</td>
                <td align="center">{{it.unitNumSjjSy}}</td>
                <td align="center">{{it.unitNumCjDepart}}</td>
                <td align="center">{{it.unitNumCjSy}}</td>
                <td align="center">{{it.unitNumType1}}</td>
                <td align="center">{{it.unitNumType2}}</td>
                <td align="center">{{it.unitNumTypeJingying}}</td>
                <td align="center">{{it.unitNumTypeWeifen}}</td>
                <td align="center">{{it.SBJZZBZ}}</td>
                <td align="center">{{it.SBJFZBZ}}</td>
                <td align="center">{{it.TJJZZBZ}}</td>
                <td align="center">{{it.TJJFZBZ}}</td>
                <td align="center">{{it.XCJZZBZ}}</td>
                <td align="center">{{it.XCJFZBZ}}</td>
                <td align="center">{{it.DABZST}}</td>
                <td align="center">{{it.DRBZST}}</td>
                <td align="center">{{it.DKBZST}}</td>
                <td align="center">{{it.SYBZHD}}</td>
                <td align="center">{{it.SYBZZB}}</td>
                <td align="center">{{it.SYBZKB}}</td>
              </tr>
              <template v-if="it.children&&it.children.length>0&&expandKeys.indexOf(it.allId.toString())>-1">
                <template v-for="it2 in it.children">
                  <tr :key="it2.allId" :style="setBgColor(it2.allId)">
                    <td v-if="canSelect" align="center"><el-checkbox v-if="it2.canExport" :label="it2.jgsyCode"><br></el-checkbox></td>
                    <td>
                      <span style="padding-left:40px"> <i v-if="it2.children&&it2.children.length>0" :class="(expandKeys.indexOf(it2.allId.toString())>-1)?'el-icon-arrow-down':'el-icon-arrow-right'" style="cursor: pointer;" @click="changeShow(it2.allId)"></i>
                        <b v-if="it2.jgsyCode" @click="detail(it2)" style="cursor:pointer;color:#0058AC">{{it2.name}}</b>
                        <template v-else>{{it2.name}}</template>
                        <!-- {{it2.name}} -->
                      </span>
                    </td>
                    <td align="center">{{it2.countCentreSy}}</td>
                    <td align="center">{{it2.unitNumBu}}</td>
                    <td align="center">{{it2.unitNumSjjDepart}}</td>
                    <td align="center">{{it2.unitNumSjjSy}}</td>
                    <td align="center">{{it2.unitNumCjDepart}}</td>
                    <td align="center">{{it2.unitNumCjSy}}</td>
                    <td align="center">{{it2.unitNumType1}}</td>
                    <td align="center">{{it2.unitNumType2}}</td>
                    <td align="center">{{it2.unitNumTypeJingying}}</td>
                    <td align="center">{{it2.unitNumTypeWeifen}}</td>
                    <td align="center">{{it2.SBJZZBZ}}</td>
                    <td align="center">{{it2.SBJFZBZ}}</td>
                    <td align="center">{{it2.TJJZZBZ}}</td>
                    <td align="center">{{it2.TJJFZBZ}}</td>
                    <td align="center">{{it2.XCJZZBZ}}</td>
                    <td align="center">{{it2.XCJFZBZ}}</td>
                    <td align="center">{{it2.DABZST}}</td>
                    <td align="center">{{it2.DRBZST}}</td>
                    <td align="center">{{it2.DKBZST}}</td>
                    <td align="center">{{it2.SYBZHD}}</td>
                    <td align="center">{{it2.SYBZZB}}</td>
                    <td align="center">{{it2.SYBZKB}}</td>
                  </tr>
                  <template v-if="it2.children&&it2.children.length>0&&expandKeys.indexOf(it2.allId.toString())>-1">
                    <template v-for="it3 in it2.children">
                      <tr :key="it3.allId">
                        <td v-if="canSelect" align="center"><el-checkbox v-if="it3.canExport" :label="it3.jgsyCode"><br></el-checkbox></td>
                        <td>
                          <span style="padding-left:60px"> <i v-if="it3.children&&it3.children.length>0" :class="(expandKeys.indexOf(it3.allId.toString())>-1)?'el-icon-arrow-down':'el-icon-arrow-right'" style="cursor: pointer;" @click="changeShow(it3.allId)"></i>
                            <b v-if="it3.jgsyCode" @click="detail(it3)" style="cursor:pointer;color:#0058AC">{{it3.name}}</b>
                            <template v-else>{{it3.name}}</template>
                            <!-- {{it3.name}} -->
                          </span>
                        </td>
                        <td align="center">{{it3.countCentreSy}}</td>
                        <td align="center">{{it3.unitNumBu}}</td>
                        <td align="center">{{it3.unitNumSjjDepart}}</td>
                        <td align="center">{{it3.unitNumSjjSy}}</td>
                        <td align="center">{{it3.unitNumCjDepart}}</td>
                        <td align="center">{{it3.unitNumCjSy}}</td>
                        <td align="center">{{it3.unitNumType1}}</td>
                        <td align="center">{{it3.unitNumType2}}</td>
                        <td align="center">{{it3.unitNumTypeJingying}}</td>
                        <td align="center">{{it3.unitNumTypeWeifen}}</td>
                        <td align="center">{{it3.SBJZZBZ}}</td>
                        <td align="center">{{it3.SBJFZBZ}}</td>
                        <td align="center">{{it3.TJJZZBZ}}</td>
                        <td align="center">{{it3.TJJFZBZ}}</td>
                        <td align="center">{{it3.XCJZZBZ}}</td>
                        <td align="center">{{it3.XCJFZBZ}}</td>
                        <td align="center">{{it3.DABZST}}</td>
                        <td align="center">{{it3.DRBZST}}</td>
                        <td align="center">{{it3.DKBZST}}</td>
                        <td align="center">{{it3.SYBZHD}}</td>
                        <td align="center">{{it3.SYBZZB}}</td>
                        <td align="center">{{it3.SYBZKB}}</td>
                      </tr>
                      <template v-if="it3.children&&it3.children.length>0&&expandKeys.indexOf(it3.allId.toString())>-1">
                        <tr v-for="it4 in it3.children" :key="it4.allId">
                          <td v-if="canSelect" align="center"><el-checkbox v-if="it4.canExport" :label="it4.jgsyCode"><br></el-checkbox></td>
                          <td>
                            <span style="padding-left:80px">
                              <b v-if="it4.jgsyCode" @click="detail(it4)" style="cursor:pointer;color:#0058AC">{{it4.name}}</b>
                              <template v-else>{{it4.name}}</template>
                              <!-- {{it4.name}} -->
                            </span>
                          </td>
                          <td align="center">{{it4.countCentreSy}}</td>
                          <td align="center">{{it4.unitNumBu}}</td>
                          <td align="center">{{it4.unitNumSjjDepart}}</td>
                          <td align="center">{{it4.unitNumSjjSy}}</td>
                          <td align="center">{{it4.unitNumCjDepart}}</td>
                          <td align="center">{{it4.unitNumCjSy}}</td>
                          <td align="center">{{it4.unitNumType1}}</td>
                          <td align="center">{{it4.unitNumType2}}</td>
                          <td align="center">{{it4.unitNumTypeJingying}}</td>
                          <td align="center">{{it4.unitNumTypeWeifen}}</td>
                          <td align="center">{{it4.SBJZZBZ}}</td>
                          <td align="center">{{it4.SBJFZBZ}}</td>
                          <td align="center">{{it4.TJJZZBZ}}</td>
                          <td align="center">{{it4.TJJFZBZ}}</td>
                          <td align="center">{{it4.XCJZZBZ}}</td>
                          <td align="center">{{it4.XCJFZBZ}}</td>
                          <td align="center">{{it4.DABZST}}</td>
                          <td align="center">{{it4.DRBZST}}</td>
                          <td align="center">{{it4.DKBZST}}</td>
                          <td align="center">{{it4.SYBZHD}}</td>
                          <td align="center">{{it4.SYBZZB}}</td>
                          <td align="center">{{it4.SYBZKB}}</td>
                        </tr>
                      </template>
                    </template>
                  </template>
                </template>
              </template>
            </template>
          </template>
        </tbody>
      </table>
      </el-checkbox-group>
      <!-- {{jgsyCodes}} -->
      <!-- <el-table :data="list" highlight-current-row v-loading="listLoading" style="width: 100%;" :height="tableHeight" border row-key="allId" :expand-row-keys="expandKeys">
        <el-table-column prop="name" label="" min-width="300">
        </el-table-column>
        <el-table-column label="单位" align="center">
          <el-table-column prop="jgznNum" label="单位职责条目" width="80" align="center" />
          <el-table-column label="按单位规格统计" width="80" align="center">
            <el-table-column prop="countCentreSy" label="事业单位合计" width="80" align="center" />
            <el-table-column prop="unitNumBu" label="副部" width="50" align="center" />
            <el-table-column label="司局级" width="100" align="center">
              <el-table-column prop="unitNumSjjDepart" label="机关" width="50" align="center" />
              <el-table-column prop="unitNumSjjSy" label="事业" width="50" align="center" />
            </el-table-column>
            <el-table-column label="处级" width="100" align="center">
              <el-table-column prop="unitNumCjDepart" label="机关" width="50" align="center" />
              <el-table-column prop="unitNumCjSy" label="事业" width="50" align="center" />
            </el-table-column>
          </el-table-column>
          <el-table-column label="按单位分类统计" width="80" align="center">
            <el-table-column label="分类" width="200" align="center">
              <el-table-column prop="unitNumType1" label="一类" width="50" align="center" />
              <el-table-column prop="unitNumType2" label="二类" width="50" align="center" />
              <el-table-column prop="unitNumTypeJingying" label="经营" width="50" align="center" />
              <el-table-column prop="unitNumTypeWeifen" label="未分" width="50" align="center" />
            </el-table-column>
          </el-table-column>
        </el-table-column>
        <el-table-column label="领导职数" width="80" align="center">
          <el-table-column label="部级" width="100" align="center">
            <el-table-column prop="SBJZZBZ" label="正职" width="50" align="center" />
            <el-table-column prop="SBJFZBZ" label="副职" width="50" align="center" />
          </el-table-column>
          <el-table-column label="司局级" width="200" align="center">
            <el-table-column prop="TJJZZBZ" label="正职" width="50" align="center" />
            <el-table-column prop="TJJFZBZ" label="副职" width="50" align="center" />
          </el-table-column>
          <el-table-column label="处级" width="100" align="center">
            <el-table-column prop="XCJZZBZ" label="正职" width="50" align="center" />
            <el-table-column prop="XCJFZBZ" label="副职" width="50" align="center" />
          </el-table-column>
        </el-table-column>
        <el-table-column label="行政编制" width="150" align="center">
            <el-table-column prop="DABZST" label="核定" width="50" align="center" />
            <el-table-column prop="DRBZST" label="在编" width="50" align="center" />
            <el-table-column prop="DKBZST" label="空缺" width="50" align="center" />
        </el-table-column>
        <el-table-column label="事业编制" width="150" align="center">
            <el-table-column prop="SYBZHD" label="核定" width="50" align="center" />
            <el-table-column prop="SYBZZB" label="在编" width="50" align="center" />
            <el-table-column prop="SYBZKB" label="空缺" width="50" align="center" />
        </el-table-column>
      </el-table> -->
      <div style="padding:10px;font-size:14px;color:red">注：<br />
  1、派出机构的领导职数不含下属事业单位数据<br />
  2、后缀为“（机关）”的单位，领导职数、行政编制数和事业编制数均为机关自身数据，不包含下属单位数据<br />
  3、机构属性为“其他（不计机构数）”、“挂靠机构（不计机构数）”的单位不计算单位数和领导职数，只计算行政编制数和事业编制数<br />
  4、行政编制数含临时编制数；部总计的行政编制含驻外编制{{zwbz}}名，部机关的行政编制含临时编制{{lsbz}}名<br />
  <span v-if="sylsbzs&&sylsbzs.length>0">{{ bz5 }}</span></div>
    </section>
  </div>
</template>

<script>
import unitDetail from './unitDetail.vue'
export default {
  components: {
    unitDetail
  },
  data () {
    return {
      canSelect: false,
      jgsyCodes: [],
      sourceTable: '',
      jgsyCode: '',
      detailVisible: false,
      bz5: '',
      lsbz: 0,
      zwbz: 0,
      sylsbzs: [],
      tableWidth: 1200,
      topBarFixed: false,
      expandKeys: [],
      filters: {
        includeCgs: true
      },
      listLoading: false,
      tableHeight: 100,
      list: [
      ],
      fileName: '',
      importVersion: '',
      supportVersion: '',
      mydata: {}
    }
  },
  methods: {
    exportAllBdData () {
      window.open(this.$http.defaults.baseURL + this.$http.defaults.zbbsmzAPI + `api/xml/exportAllUnitExcel`)
    },
    exportData () {
      var form = document.createElement('form')
      form.setAttribute('method', 'post')
      form.setAttribute('target', '_blank')
      var input = document.createElement('input')
      input.setAttribute('type', 'hidden')
      input.setAttribute('name', 'jgsyCodes')
      input.setAttribute('value', this.jgsyCodes.join(','))
      form.append(input)
      form.setAttribute('action', this.$http.defaults.baseURL + this.$http.defaults.zbbsmzAPI + 'api/xml/exportUnitExcel')
      document.body.appendChild(form)
      form.submit()
      form.remove()
    },
    detail (obj) {
      console.log(obj.jgsyCode)
      console.log(obj.sourceTable)
      this.jgsyCode = obj.jgsyCode
      this.sourceTable = obj.sourceTable
      this.mydata = {}
      this.mydata.xzbz = obj.DABZST
      this.mydata.xzzb = obj.DRBZST
      this.mydata.sybz = obj.SYBZHD
      this.mydata.syzb = obj.SYBZZB
      this.detailVisible = true
    },
    setBgColor (id) {
      switch (id.toString()) {
        case '1':
          return 'background: #eee;'
        case '2':
          return 'background: #DFF1FF;'
        case '2-1':
          return 'background: #FFE8E8;'
        case '2-2':
          return 'background: #EBF3E4;'
        case '2-3':
          return 'background: #EBF2FA;'
        case '3':
          return 'background: #FDF7EC;'
        case '3-1':
          return 'background: #FFFFD7;'
        case '3-2':
          return 'background: #FFFFD7;'
        case '4':
          return 'background: #E1F7FF;'
        default:
          return ''
      }
    },
    changeShow (id) {
      console.log(id)
      id = id.toString()
      console.log(this.expandKeys)
      if (this.expandKeys.indexOf(id) > -1) {
        this.expandKeys.splice(this.expandKeys.indexOf(id), 1)
      } else {
        this.expandKeys.push(id)
      }
      console.log(this.expandKeys)
    },
    exportUnitData () {
      window.open(this.$http.defaults.baseURL + this.$http.defaults.zbbsmzAPI + `api/xml/getAndExportSimple`)
    },
    exportAllData () {
      window.open(this.$http.defaults.baseURL + this.$http.defaults.zbbsmzAPI + `api/xml/exportUnitStatExcel?includeCgs=` + this.filters.includeCgs)
    },
    exportTopData () {
      window.open(this.$http.defaults.baseURL + this.$http.defaults.zbbsmzAPI + `api/xml/export`)
    },
    importData () {
      this.$router.push({name: 'zbbsmzImportData'})
    },
    analyseData () {
      this.$router.push({path: 'analyse', query: { includeCgs: this.filters.includeCgs }})
    },
    getVersion () {
      this.$http
        .get(this.$http.defaults.zbbsmzAPI + `api/busLog/getSupportVersion`)
        .then(response => {
          if (response.data.success) {
            this.fileName = response.data.result.fileName
            this.importVersion = response.data.result.importVersion
            this.supportVersion = response.data.result.supportVersion
            localStorage.setItem('suppotVersion', this.supportVersion)
          } else {
            this.$message({
              message: '获取支持版本失败：' + response.data.message,
              type: 'error'
            })
            console.log(response.data.message)
            // this.importData()
          }
        })
        .catch(error => {
          this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    getList () {
      this.listLoading = true
      this.$http
        .get(this.$http.defaults.zbbsmzAPI + `api/xml/getUnitStatJson?includeCgs=` + this.filters.includeCgs)
        .then(response => {
          this.listLoading = false
          if (response.data.success) {
            this.list = response.data.result.list
            this.lsbz = response.data.result.lsbz
            this.zwbz = response.data.result.zwbz
            this.sylsbzs = response.data.result.sylsbzs
            let syListText = this.sylsbzs.map(item => item.MC + '临时编制' + item.S_A_LSBZ + '名').join('、')
            let S_A_LSBZ = 0
            this.sylsbzs.forEach(item => {
              S_A_LSBZ = S_A_LSBZ + item.S_A_LSBZ
            })
            this.bz5 = '5、事业编制含' + syListText + '，累计临时编制' + S_A_LSBZ + '名'
            // this.list = [
            //   {
            //     allId: '0',
            //     name: '部总计',
            //     jgznNum: 100,
            //     children: [
            //       {
            //         name: '部机关',
            //         jgznNum: 80,
            //         allId: '1',
            //         children: [
            //           {
            //             name: '办公厅',
            //             allId: '1-1',
            //             jgznNum: 10,
            //             children: [
            //               {name: '办公厅一处', allId: '1-1-1', jgznNum: 10},
            //               {name: '办公厅二处', allId: '1-1-2', jgznNum: 20},
            //               {name: '办公厅三处', allId: '1-1-3', jgznNum: 30},
            //               {name: '办公厅综合处', allId: '1-1-4', jgznNum: 40}
            //             ]
            //           },
            //           {
            //             name: '人事司',
            //             allId: '1-2',
            //             jgznNum: 10,
            //             children: [
            //               {name: '干部一处', allId: '1-2-1', jgznNum: 10},
            //               {name: '干部二处', allId: '1-2-2', jgznNum: 20},
            //               {name: '干部三处', allId: '1-2-3', jgznNum: 30},
            //               {name: '综合处', allId: '1-2-4', jgznNum: 40}
            //             ]
            //           },
            //           {
            //             name: '机关党委',
            //             allId: '1-3',
            //             jgznNum: 10,
            //             children: [
            //               {name: '机关党委一处', allId: '1-3-1', jgznNum: 10},
            //               {name: '机关党委二处', allId: '1-3-2', jgznNum: 20},
            //               {name: '机关党委三处', allId: '1-3-3', jgznNum: 30},
            //               {name: '机关党委综合处', allId: '1-3-4', jgznNum: 40}
            //             ]
            //           }
            //         ]
            //       },
            //       {
            //         allId: '2',
            //         name: '派出机构',
            //         jgznNum: 80,
            //         children: [
            //           {
            //             name: '督察局',
            //             allId: '2-1',
            //             jgznNum: 10,
            //             children: [
            //               {name: '北京', allId: '2-1-1', jgznNum: 10},
            //               {name: '沈阳', allId: '2-1-2', jgznNum: 10},
            //               {name: '上海', allId: '2-1-3', jgznNum: 10},
            //               {name: '南京',
            //                 allId: '2-1-4',
            //                 jgznNum: 10,
            //                 children: [
            //                   {name: '南京局下设1', allId: '2-1-4-1', jgznNum: 10},
            //                   {name: '南京局下设2', allId: '2-1-4-2', jgznNum: 20},
            //                   {name: '南京局下设3', allId: '2-1-4-3', jgznNum: 30},
            //                   {name: '南京局下设4', allId: '2-1-4-4', jgznNum: 40}
            //                 ]
            //               }
            //             ]
            //           },
            //           {
            //             name: '测绘局',
            //             allId: '2-2',
            //             jgznNum: 10,
            //             children: [
            //               {name: '陕西', allId: '2-2-1', jgznNum: 10},
            //               {name: '龙江', allId: '2-2-2', jgznNum: 10},
            //               {name: '四川', allId: '2-2-3', jgznNum: 10},
            //               {name: '海南',
            //                 allId: '2-2-4',
            //                 jgznNum: 10,
            //                 children: [
            //                   {name: '海南局下设1', allId: '2-2-4-1', jgznNum: 10},
            //                   {name: '海南局下设2', allId: '2-2-4-2', jgznNum: 20},
            //                   {name: '海南局下设3', allId: '2-2-4-3', jgznNum: 30},
            //                   {name: '海南局下设4', allId: '2-2-4-4', jgznNum: 40}
            //                 ]
            //               }
            //             ]
            //           },
            //           {
            //             name: '海区局',
            //             jgznNum: 10,
            //             allId: '2-3',
            //             children: [
            //               {name: '北海', allId: '2-3-1', jgznNum: 10},
            //               {name: '东海', allId: '2-3-2', jgznNum: 10},
            //               {name: '南海',
            //                 allId: '2-3-3',
            //                 jgznNum: 10,
            //                 children: [
            //                   {name: '南海局下设1', allId: '2-3-3-1', jgznNum: 10},
            //                   {name: '南海局下设2', allId: '2-3-3-2', jgznNum: 20},
            //                   {name: '南海局下设3', allId: '2-3-3-3', jgznNum: 30},
            //                   {name: '南海局下设4', allId: '2-3-3-4', jgznNum: 40}
            //                 ]
            //               }
            //             ]
            //           }
            //         ]
            //       },
            //       {
            //         name: '直属单位',
            //         allId: '3',
            //         jgznNum: 70,
            //         children: [
            //           {
            //             name: '京内',
            //             allId: '3-1',
            //             jgznNum: 10,
            //             children: [
            //               {
            //                 name: '中国国土勘测规划院',
            //                 allId: '3-1-1',
            //                 jgznNum: 10},
            //               {
            //                 name: '中国自然资源经济研究院',
            //                 allId: '3-1-2',
            //                 jgznNum: 10,
            //                 children: [
            //                   {name: '经研院下设1', allId: '3-1-2-1', jgznNum: 10},
            //                   {name: '经研院下设2', allId: '3-1-2-2', jgznNum: 20},
            //                   {name: '经研院下设3', allId: '3-1-2-3', jgznNum: 30},
            //                   {name: '经研院下设4', allId: '3-1-2-4', jgznNum: 40}
            //                 ]
            //               }
            //             ]
            //           },
            //           {
            //             name: '京外',
            //             allId: '3-2',
            //             jgznNum: 10,
            //             children: [
            //               {
            //                 name: '自然资源部天津海水淡化与综合利用研究所',
            //                 allId: '3-2-1',
            //                 jgznNum: 10
            //               },
            //               {
            //                 name: '自然资源部海洋发展战略研究所',
            //                 allId: '3-2-2',
            //                 jgznNum: 10,
            //                 children: [
            //                   {name: '海洋所下设1', allId: '3-2-2-1', jgznNum: 10},
            //                   {name: '海洋所下设2', allId: '3-2-2-2', jgznNum: 20},
            //                   {name: '海洋所下设3', allId: '3-2-2-3', jgznNum: 30},
            //                   {name: '海洋所下设4', allId: '3-2-2-4', jgznNum: 40}
            //                 ]
            //               }
            //             ]
            //           }
            //         ]
            //       },
            //       {
            //         name: '地调局属',
            //         allId: '4',
            //         jgznNum: 70,
            //         children: [
            //           {
            //             name: '机关',
            //             allId: '4-1',
            //             jgznNum: 10
            //           },
            //           {
            //             name: '事业',
            //             allId: '4-2',
            //             jgznNum: 10,
            //             children: [
            //               {name: '地调局下设1', allId: '4-2-1', jgznNum: 10},
            //               {name: '地调局下设2', allId: '4-2-2', jgznNum: 20},
            //               {name: '地调局下设3', allId: '4-2-3', jgznNum: 30},
            //               {name: '地调局下设4', allId: '4-2-4', jgznNum: 40}
            //             ]
            //           }
            //         ]
            //       }
            //     ]
            //   }
            // ]
            this.expandKeys = ['0', '2', '2-1', '2-2', '2-3', '3', '4']
            // this.list.forEach(item => {
            //   if (this.expandKeys.indexOf(item.allId.toString()) > -1) {
            //     item.showSub = true
            //   } else {
            //     item.showSub = false
            //   }
            //   if (item.children) {
            //     item.children.forEach(it => {
            //       if (this.expandKeys.indexOf(it.allId.toString()) > -1) {
            //         it.showSub = true
            //       } else {
            //         it.showSub = false
            //       }
            //       if (it.children) {
            //         it.children.forEach(it2 => {
            //           if (this.expandKeys.indexOf(it2.allId.toString()) > -1) {
            //             it2.showSub = true
            //           } else {
            //             it2.showSub = false
            //           }
            //           if (it2.children) {
            //             it2.children.forEach(it3 => {
            //               if (this.expandKeys.indexOf(it3.allId.toString()) > -1) {
            //                 it3.showSub = true
            //               } else {
            //                 it3.showSub = false
            //               }
            //             })
            //           }
            //         })
            //       }
            //     })
            //   }
            // })
          } else {
            this.$message({
              message: '暂无数据：请先进行数据导入操作',
              type: 'error'
            })
            console.log(response.data.message)
            // this.importData()
          }
        })
        .catch(error => {
          this.listLoading = false
          this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    tableresize (obj) {
      var clientHeight = 0
      if (document.body.clientHeight && document.documentElement.clientHeight) {
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      } else {
        clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      }
      let myheight = 253
      obj.$nextTick(function () {
        obj.tableHeight = clientHeight - myheight
      })
    }
  },
  mounted () {
    this.getVersion()
    this.getList()
    this.tableresize(this)
    this.tableWidth = this.$refs.dataTable.offsetWidth
    window.onresize = () => {
      this.tableresize(this)
      console.log('this.$refs.dataTable.offsetWidth')
      console.log(this.$refs.dataTable.offsetWidth)
      this.tableWidth = this.$refs.dataTable.offsetWidth
    }
  }
}
</script>
<style>
#zbbsmzIndex .el-drawer__wrapper{
  width: 100%;
  height: 100%;
  position: fixed !important;
  overflow: hidden;
}
  .wboxd .el-table th{
    font-weight: normal;
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
  }
  .wboxd .el-table td, .el-table th{
    padding:0;
    font-size:var(--size14) !important;
    line-height: 20px;
    font-family: '宋体'
  }
  .tableth{
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
    height:33px;
  }
  #zbbsmzIndex .el-table td{
    border-right: 1px solid #95B8E7;
    border-bottom: 1px solid #95B8E7;
  }
  #zbbsmzIndex .el-table--border th, .el-table--border td {
    border-right: 1px solid #95B8E7;
    border-bottom: 1px solid #95B8E7;
  }
  #zbbsmzIndex .el-table .el-table__cell{
    padding: 2px 0;
  }
</style>
<style scoped>
  #zbbsmzIndex .el-button{
    color:#fff !important;
  }
  #zbbsmzIndex h1{
    font-size:var(--size16) !important;
    font-weight: bolder;
    height: 30px;
    border-bottom: 1px solid #95B8E7;
    font-family: '宋体';
    line-height: 30px;
    color: #000;
    padding-left:10px;
    background-image: linear-gradient(to bottom , #EEF4FF, #E0ECFF);
    margin:0;
  }
  .el-pagination{
    float: left;
    padding:7px 10px;
  }
  #zbbsmzIndex .wboxs{
    width: 100%;
    background: #fff;
    border: 1px solid #95B8E7;
    margin:0 10px;
    overflow: hidden;
    padding:0;
    height:95px;
  }
  .wboxd{
    padding:0;
    width: calc(100% - 0px);
    background: #fff;
    border: 1px solid #95B8E7;
    margin:0 10px;
    overflow: hidden;
  }
  .mainBzTable{
    margin:0;
    padding:0;
    width: 100%;
    font-family: "宋体";
    font-size: 14px;
    border: 0;
  }
  .mainBzTable td,
  .mainBzTable th{
    font-weight: lighter !important;
    margin:0;
    border-left: none;
    border-top: none;
    border-right: 1px solid #95B8E7;
    border-bottom: 1px solid #95B8E7;
    padding: 5px 0;
  }
  .mainBzTable th{
    background: #F5F7FA;
  }
  .mainBzTable td{
    padding:5px;
  }
  .mainBzTable tr:hover {
    background-color: #F5F7FA !important; /* hover 模式下的背景颜色 */
  }
</style>
